<template>
    <channel :header="header" :channels="channels" @channel-item-click="handleClick"></channel>
</template>
<script>
  import Channel from 'byted-toutiao-pc-business-components/components/channel'
  import Vue from 'vue'

  export default {
    props: {
      tag: {
        type: String,
        default: ''
      }
    },
    data () {
      return {
        header: {
          logoImg: require('../assets/logo.png'),
          logoAlt: '今日头条',
          logoWidth: '108px',
          logoHeight: '27px'
        },
        channels: {
          tag: this.tag,
          items: [
            {name: '推荐', url: '/', log: 'recommand'},
            {name: '热点', url: '/ch/news_hot/', log: 'hot'},
            {name: '视频', url: '/ch/video/', log: 'video'},
            {name: '图片', url: '/ch/news_image/', log: 'image', target: '_blank'},
            {name: '段子', url: '/ch/essay_joke/', log: 'joke'},
            {name: '社会', url: '/ch/news_society/', log: 'social'},
            {name: '娱乐', url: '/ch/news_entertainment/', log: 'entertainment'},
            {name: '科技', url: '/ch/news_tech/', log: 'technology'},
            {name: '体育', url: '/ch/news_sports/', log: 'sports'},
            {name: '汽车', url: '/ch/news_car/', log: 'car'},
            {name: '财经', url: '/ch/news_finance/', log: 'finance'},
            {name: '搞笑', url: '/ch/funny/', log: 'funny'}
          ],
          more: [
            {name: '军事', url: '/ch/news_military/', log: 'military'},
            {name: '国际', url: '/ch/news_world/', log: 'international'},
            {name: '时尚', url: '/ch/news_fashion/', log: 'fashion'},
            {name: '旅游', url: '/ch/news_travel/', log: 'travel'},
            {name: '探索', url: '/ch/news_discovery/', log: 'explore'},
            {name: '育儿', url: '/ch/news_baby/', log: 'childcare'},
            {name: '养生', url: '/ch/news_regimen/', log: 'health'},
            {name: '故事', url: '/ch/news_story/', log: 'story'},
            {name: '美文', url: '/ch/news_essay/', log: 'article'},
            {name: '游戏', url: '/ch/news_game/', log: 'game'},
            {name: '历史', url: '/ch/news_history/', log: 'history'},
            {name: '美食', url: '/ch/news_food/', log: 'food'}
          ]
        }
      }
    },
    components: {
      Channel
    },
    methods: {
      handleClick (item) {
        if (window.localStorage && item && item.name === '视频') {
          // 如果是地区北京则视频栏目新建窗口打开
          var lastCity = window.localStorage.getItem('weather_city')

          if (lastCity) {
            lastCity = JSON.parse(lastCity)
            Vue.set(this.channels.items, 2, {
              name: '视频',
              url: '/ch/video/',
              log: 'video',
              target: lastCity.city === '北京' ? '_blank' : '_self'
            })
          }
        }
      }
    }
  }
</script>
